<#assign ctx=request.contextPath />
<#import '${ctx}/sys/include/head.html' as d/>
<#import '${ctx}/sys/include/body.html' as c/>
<#import '${ctx}/sys/include/table/select.html' as select />
<!DOCTYPE html>
<html>
<head>
<@d.head title="数据源列表" />
</head>
<@c.body>
<div class="container" style="margin-top:35px;">
	<div class="layui-form">
		<div class="layui-form-item">
			<label class="layui-form-label">选择数据源</label>
			<div class="layui-input-block">
				<div id="search_area_path">
					<input type="text" placeholder="点击选择" autocomplete="off" name="path"
					class="layui-input" readonly="readonly" style="width:65%">
					<input name="path" type="hidden" />
				</div>
			</div>
		</div>
		<div class="layui-form-item" id="search-div">
			<label class="layui-form-label">搜索列</label>
			<div class="layui-input-block" style="width:60%">
				<input type="text" id="field_name" name="field_name" placeholder="搜索列" autocomplete="off"
					class="layui-input">
				<input type="checkbox" title="可搜索" name="field_searchable" lay-filter="field_box" class="layui-input" checked="checked"/>
				<input type="checkbox" title="可聚合" name="field_aggregatable" lay-filter="field_box" class="layui-input" checked="checked"/>
			</div>
		</div>
	</div>
</div>
<table class="layui-hide" id="field_table" lay-filter="field_table">
</table>

<script>
layui.use(['table','appJs','layer'],function(){
	var table = layui.table;
	var app = layui.appJs;
	var $ = layui.$;
	var layer = layui.layer;
	var form = layui.form;

	$("#search-div").hide();

	var colomns = [];
	colomns.push({field:'id',title:'ID'});
	colomns.push({field:'name',title:'字段名',sort:true});
	colomns.push({field:'alias',title:'字段别名',sort:true});
	colomns.push({field:'type',title:'类型',sort:true});
	colomns.push({field:'searchable',title:'可搜索',sort:true});
	colomns.push({field:'aggregatable',title:'可聚合',sort:true});
	colomns.push({fixed: 'right', width: 165, align:'center', toolbar: '#itemBar'});

	var tableOptions = {
		    elem: '#field_table'
		    ,url: '${ctx}/biz/data/ds/field_list' //数据接口
		    ,title: ''
		    ,toolbar:'#topBar'
		    ,page: true //开启分页
		    ,cols: [colomns]
		};

	$("input[name='path']").unbind('click');
	$("input[name='path']").bind('click',function(){
		var $holder = $(this);
		var index = layer.open({
			 type:2,
			 title:'请选择',
			 maxmin :true,
			 content:['${ctx}/biz/c/p/ds-select-table'],
			 area:['70%','70%'],
			 success:function(layero,index){
				 var iframeWin = window[layero.find('iframe')[0]['name']];
				 $(iframeWin.document).find("#parent_name").val("path");
				 $(iframeWin.document).find("#check_btn").bind('click',function(){
						var checkStatus = iframeWin.layui.table.checkStatus('search_table');
						var index = layer.getFrameIndex(iframeWin.name); //获取窗口索引
						if(checkStatus.data.length == 1) {
							var data = checkStatus.data[0];
							var show = [];
							for(var v in data) {
								show.push(data[v])
							}
							$holder.val(data['name']);
							$holder.next().val(data['id']);
						}
					    layer.close(index);
					});
			 },
			 end:function(){
				tableOptions.where = {id:$("#search_area_path").find("input:last").val()};
				table.render(tableOptions);
				bindSearch();
			 }
		});
		layer.iframeAuto(index)
	});

	function rebuildTable() {
		 var uname = $("#field_name").val();
		  var searchable = $('input[name="field_searchable"]').next().hasClass('layui-form-checked');
		  var aggregatable = $('input[name="field_aggregatable"]').next().hasClass('layui-form-checked');
		  tableOptions.where={
		    		search_field : "name",
		    		search_value:uname,
		    		id:$("#search_area_path").find("input:last").val(),
		    		searchable:searchable,
		    		aggregatable:aggregatable
		    }
		    table.render(tableOptions);
	}

	var inputDelay;
	function bindSearch() {
		$("#search-div").show();
		form.on('checkbox(field_box)',function(data){
			rebuildTable();
		});

		$("#field_name").bind('input',function(){
			clearTimeout(inputDelay);
			inputDelay = setTimeout(function(){
				rebuildTable();
			},500);
		});
	}



	table.on('tool(field_table)',function(obj){
		  var data = obj.data; //获得当前行数据
		  layer.prompt({title: '请输入别名'}, function(text, index){
			  layer.close(index);
			  $.post('${ctx}/biz/data/ds/field/update_alias',{alias:text,id:data.id},function(data){
				  if(data.code == 0){
				 		layer.msg(data.msg);
				  }else{
					  layer.msg(data.code+": "+data.msg);
				  }
				  table.render(tableOptions);
				  bindSearch();
			  });
			});
	})
})
</script>
</@c.body>
<script type="text/html" id="itemBar">
  	<a class="layui-btn layui-btn-xs" lay-event="edit">设置别名</a>
</script>
